

import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:go_router/go_router.dart';
import 'package:xim/business/model/user.dart';
import 'package:xim/common/style/colors.dart';
import 'package:xim/http/apis.dart';
import 'package:xim/http/apis/user/user_api.dart';
import 'package:xim/http/apis/user/user_model.dart';
import 'package:xim/widget/common/state.dart';
import 'package:xim/widget/common/ui/cell.dart';


class ProfileSelfInfoPage extends StatefulWidget {

  final String account;

  const ProfileSelfInfoPage({Key? key, required this.account}) : super(key: key);

  @override
  State<ProfileSelfInfoPage> createState() => _ProfileSelfInfoPageState();

}

class _ProfileSelfInfoPageState extends AppBarState<ProfileSelfInfoPage>
    with BrightnessModeState<ProfileSelfInfoPage>, ShimmerState<ProfileSelfInfoPage>{


  ModelColor bgColor = ModelColor(darkColor: const Color(0xff111111), lightColor: const Color(0xffededed));
  ModelColor textColor = ModelColor(lightColor: const Color((0xff161616)), darkColor: const Color(0xffcecece));
  ModelColor fgColor = ModelColor(lightColor: const Color(0xfffefefe), darkColor: const Color(0xff181818));
  ModelColor weakTextColor = ModelColor(lightColor: const Color(0xff737373), darkColor: const Color(0xff8c8c8c));
  ModelColor inputBorder = ModelColor(lightColor: const Color(0xff181818), darkColor: const Color(0xff272727));
  ModelColor dividerColor = ModelColor(lightColor: const Color(0xffededed), darkColor: const Color(0xff1e1e1e));

  late UserInfoModel userInfo;

  @override
  String get appBarTitle => "个人消息";

  @override
  Color get appBarBgColor => bgColor.color;

  @override
  TextStyle get appBarTitleStyle => TextStyle(color: textColor.color, fontSize: 14);

  @override
  IconThemeData get iconTheme => IconThemeData(color: textColor.color);

  @override
  List<ModelColor> get brightnessColors => [bgColor, textColor,fgColor,weakTextColor,inputBorder,dividerColor];

  TextStyle get titleStyle => TextStyle(color: textColor.color, fontSize: 14);
  TextStyle get weakTextStyle => TextStyle(color: weakTextColor.color, fontSize: 13);

  Widget get arrow => Icon(Icons.chevron_right, color: textColor.color, size: 16,);

  EdgeInsets cellPadding = const EdgeInsets.symmetric(horizontal: 8, vertical: 18);

  @override
  Widget widgetBuild(BuildContext context) {
    return Scaffold(
      appBar: appBar,
      body: Container(
        color: bgColor.color,
        child: Column(
          children: [
            avatar,
            divider,
            userName,
            divider,
            userAccount,
            divider,
            userQr,
            const SizedBox(height: 12,),
            moreInfo
          ],
        ),
      ),
    );
  }

  @override
  void initContextDate(context) {
    super.initContextDate(context);
    initModelColor(context);
  }

  @override
  Future<void> initData() async {
   var info = await UserApi.queryUserInfo(account: widget.account);
    setState(() {
      userInfo = info;
    });
    return super.initData();
  }

  Widget get divider => Container(
    height: 0.8,
    color: dividerColor.color,
  );


  Widget get avatar {
    var clipRRect = ClipRRect(
        borderRadius: const BorderRadius.all(Radius.circular(8)),
        child: Image.network(userInfo.avatar??'', width: 40,)
    );
    return Cell(leftItem: Text("头像" ,style: titleStyle,), rightItem: Row(
      children: [
        clipRRect,
        const SizedBox(width: 4,),
        arrow,
      ],
    ),
      padding: cellPadding,
      decoration: BoxDecoration(color: fgColor.color),
    );
  }

  Widget get userName {
    return Cell(
        leftItem: Text("用户名" ,style: titleStyle,),
        rightItem: Row(
          children: [
          Text(userInfo.name, style: weakTextStyle,),
          const SizedBox(width: 4,),
          arrow,
        ],),
      padding: cellPadding,
      decoration: BoxDecoration(
          color: fgColor.color
      ),
    );
  }

  Widget get userAccount {
    return Cell(
      onLongPress: () async {
        // copy account
        await Clipboard.setData(ClipboardData(text: userInfo.account));
        toast("账号拷贝成功");
      },
      leftItem: Text("账号" ,style: titleStyle,),
      rightItem: Text(userInfo.account, style: weakTextStyle,),
      padding: cellPadding,
      decoration: BoxDecoration(
          color: fgColor.color
      ),
    );
  }

  Widget get userQr {
    return Cell(
      onTab: ()=>context.push("/qr/user/${userInfo.account}"),
      leftItem: Text("二维码名片" ,style: titleStyle,),
      rightItem: Row(
        children: [
          Icon(Icons.qr_code, color: textColor.color, size: 16,),
          const SizedBox(width: 4,),
          arrow,
        ],
      ),
      padding: cellPadding,
      decoration: BoxDecoration(
        color: fgColor.color
      ),
    );
  }

  Widget get moreInfo {
    return Cell(
      leftItem: Text("更多信息" ,style: titleStyle,),
      rightItem: arrow,
      padding: cellPadding,
      decoration: BoxDecoration(
          color: fgColor.color
      ),
    );
  }
}
